<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>设置内容</title>
</head>
<body>
<p id="test1">这是一个有 <b>粗体</b> 字的段落。</p>
<p id="test2">这是另外一个有 <b>粗体</b> 字的段落。</p>
<button id="btn1">显示 新/旧 文本</button>
<button id="btn2">显示 新/旧 HTML</button>
<script src="jquery-3.3.1.js"></script>
<script>
    $(document).ready(function(){
        $("#btn1").click(function(){
            $("#test1").text(function(i,origText){
                return "旧文本: " + origText + " 新文本: Hello world! (index: " + i + ")";
            });
        });

        $("#btn2").click(function(){
            $("#test2").html(function(i,origText){
                return "旧 html: " + origText + " 新 html: Hello <b>world!</b> (index: " + i + ")";
            });
        });

    });
</script>
</body>
</html>